<!DOCTYPE html>
<html class="no-js css-menubar" lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
  <meta name="description" content="bootstrap admin template">
  <meta name="author" content="">

  <title>Icons | Remark Admin Template</title>

  <link rel="apple-touch-icon" href="../../assets/images/apple-touch-icon.png">
  <link rel="shortcut icon" href="../../assets/images/favicon.ico">

  <!-- Stylesheets -->
  <link rel="stylesheet" href="../../assets/css/bootstrap.min.css">
  <link rel="stylesheet" href="../../assets/css/bootstrap-extend.min.css">
  <link rel="stylesheet" href="../../assets/css/site.min.css">

  <!-- Plugins -->
  <link rel="stylesheet" href="../../assets/vendor/animsition/animsition.css">
  <link rel="stylesheet" href="../../assets/vendor/asscrollable/asScrollable.css">
  <link rel="stylesheet" href="../../assets/vendor/switchery/switchery.css">
  <link rel="stylesheet" href="../../assets/vendor/intro-js/introjs.css">
  <link rel="stylesheet" href="../../assets/vendor/slidepanel/slidePanel.css">
  <link rel="stylesheet" href="../../assets/vendor/flag-icon-css/flag-icon.css">

  <!-- Plugins For This Page -->
  <link rel="stylesheet" href="../../assets/vendor/asrange/asRange.css">

  <!-- Page -->
  <link rel="stylesheet" href="../../assets/examples/css/uikit/icon.css">

  <!-- Fonts -->
  <link rel="stylesheet" href="../../assets/fonts/web-icons/web-icons.min.css">
  <link rel="stylesheet" href="../../assets/fonts/brand-icons/brand-icons.min.css">
  <link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Roboto:300,400,500,300italic'>
  <link rel="stylesheet" href="../../assets/fonts/font-awesome/font-awesome.css">

  <!--[if lt IE 9]>
    <script src="../../assets/vendor/html5shiv/html5shiv.min.js"></script>
    <![endif]-->

  <!--[if lt IE 10]>
    <script src="../../assets/vendor/media-match/media.match.min.js"></script>
    <script src="../../assets/vendor/respond/respond.min.js"></script>
    <![endif]-->

  <!-- Scripts -->
  <script src="../../assets/vendor/modernizr/modernizr.js"></script>
  <script src="../../assets/vendor/breakpoints/breakpoints.js"></script>
  <script>
    Breakpoints();
  </script>
</head>
<body>
  <!--[if lt IE 8]>
        <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->

  <nav class="site-navbar navbar navbar-default navbar-fixed-top navbar-mega" role="navigation">

    <div class="navbar-header">
      <button type="button" class="navbar-toggle hamburger hamburger-close navbar-toggle-left hided"
      data-toggle="menubar">
        <span class="sr-only">Toggle navigation</span>
        <span class="hamburger-bar"></span>
      </button>
      <button type="button" class="navbar-toggle collapsed" data-target="#site-navbar-collapse"
      data-toggle="collapse">
        <i class="icon wb-more-horizontal" aria-hidden="true"></i>
      </button>
      <div class="navbar-brand navbar-brand-center site-gridmenu-toggle" data-toggle="gridmenu">
        <img class="navbar-brand-logo" src="../../assets/images/logo.png" title="Remark">
        <span class="navbar-brand-text"> Remark</span>
      </div>
      <button type="button" class="navbar-toggle collapsed" data-target="#site-navbar-search"
      data-toggle="collapse">
        <span class="sr-only">Toggle Search</span>
        <i class="icon wb-search" aria-hidden="true"></i>
      </button>
    </div>

    <div class="navbar-container container-fluid">
      <!-- Navbar Collapse -->
      <div class="collapse navbar-collapse navbar-collapse-toolbar" id="site-navbar-collapse">
        <!-- Navbar Toolbar -->
        <ul class="nav navbar-toolbar">
          <li class="hidden-float" id="toggleMenubar">
            <a data-toggle="menubar" href="#" role="button">
              <i class="icon hamburger hamburger-arrow-left">
                  <span class="sr-only">Toggle menubar</span>
                  <span class="hamburger-bar"></span>
                </i>
            </a>
          </li>
          <li class="hidden-xs" id="toggleFullscreen">
            <a class="icon icon-fullscreen" data-toggle="fullscreen" href="#" role="button">
              <span class="sr-only">Toggle fullscreen</span>
            </a>
          </li>
          <li class="hidden-float">
            <a class="icon wb-search" data-toggle="collapse" href="#" data-target="#site-navbar-search"
            role="button">
              <span class="sr-only">Toggle Search</span>
            </a>
          </li>
          <li class="dropdown dropdown-fw dropdown-mega">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false"
            data-animation="fade" role="button">Mega <i class="icon wb-chevron-down-mini" aria-hidden="true"></i></a>
            <ul class="dropdown-menu" role="menu">
              <li role="presentation">
                <div class="mega-content">
                  <div class="row">
                    <div class="col-sm-4">
                      <h5>UI Kit</h5>
                      <ul class="blocks-2">
                        <li class="mega-menu margin-0">
                          <ul class="list-icons">
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../../advanced/animation.html">Animation</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../buttons.html">Buttons</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../colors.html">Colors</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../dropdowns.html">Dropdowns</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../icons.html">Icons</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../../advanced/lightbox.html">Lightbox</a>
                            </li>
                          </ul>
                        </li>
                        <li class="mega-menu margin-0">
                          <ul class="list-icons">
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../modals.html">Modals</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../panel-structure.html">Panels</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../../structure/overlay.html">Overlay</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../tooltip-popover.html ">Tooltips</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../../advanced/scrollable.html">Scrollable</a>
                            </li>
                            <li><i class="wb-chevron-right-mini" aria-hidden="true"></i>
                              <a
                              href="../typography.html">Typography</a>
                            </li>
                          </ul>
                        </li>
                      </ul>
                    </div>
                    <div class="col-sm-4">
                      <h5>Media
                        <span class="badge badge-success">4</span>
                      </h5>
                      <ul class="blocks-3">
                        <li>
                          <a class="thumbnail margin-0" href="javascript:void(0)">
                            <img class="width-full" src="../../assets/photos/placeholder.png" alt="..."
                            />
                          </a>
                        </li>
                        <li>
                          <a class="thumbnail margin-0" href="javascript:void(0)">
                            <img class="width-full" src="../../assets/photos/placeholder.png" alt="..."
                            />
                          </a>
                        </li>
                        <li>
                          <a class="thumbnail margin-0" href="javascript:void(0)">
                            <img class="width-full" src="../../assets/photos/placeholder.png" alt="..."
                            />
                          </a>
                        </li>
                        <li>
                          <a class="thumbnail margin-0" href="javascript:void(0)">
                            <img class="width-full" src="../../assets/photos/placeholder.png" alt="..."
                            />
                          </a>
                        </li>
                        <li>
                          <a class="thumbnail margin-0" href="javascript:void(0)">
                            <img class="width-full" src="../../assets/photos/placeholder.png" alt="..."
                            />
                          </a>
                        </li>
                        <li>
                          <a class="thumbnail margin-0" href="javascript:void(0)">
                            <img class="width-full" src="../../assets/photos/placeholder.png" alt="..."
                            />
                          </a>
                        </li>
                      </ul>
                    </div>
                    <div class="col-sm-4">
                      <h5 class="margin-bottom-0">Accordion</h5>
                      <!-- Accordion -->
                      <div class="panel-group panel-group-simple" id="siteMegaAccordion" aria-multiselectable="true"
                      role="tablist">
                        <div class="panel">
                          <div class="panel-heading" id="siteMegaAccordionHeadingOne" role="tab">
                            <a class="panel-title" data-toggle="collapse" href="#siteMegaCollapseOne" data-parent="#siteMegaAccordion"
                            aria-expanded="false" aria-controls="siteMegaCollapseOne">
                                Collapsible Group Item #1
                              </a>
                          </div>
                          <div class="panel-collapse collapse" id="siteMegaCollapseOne" aria-labelledby="siteMegaAccordionHeadingOne"
                          role="tabpanel">
                            <div class="panel-body">
                              De moveat laudatur vestra parum doloribus labitur sentire partes, eripuit praesenti
                              congressus ostendit alienae, voluptati ornateque
                              accusamus clamat reperietur convicia albucius.
                            </div>
                          </div>
                        </div>
                        <div class="panel">
                          <div class="panel-heading" id="siteMegaAccordionHeadingTwo" role="tab">
                            <a class="panel-title collapsed" data-toggle="collapse" href="#siteMegaCollapseTwo"
                            data-parent="#siteMegaAccordion" aria-expanded="false"
                            aria-controls="siteMegaCollapseTwo">
                                Collapsible Group Item #2
                              </a>
                          </div>
                          <div class="panel-collapse collapse" id="siteMegaCollapseTwo" aria-labelledby="siteMegaAccordionHeadingTwo"
                          role="tabpanel">
                            <div class="panel-body">
                              Praestabiliorem. Pellat excruciant legantur ullum leniter vacare foris voluptate
                              loco ignavi, credo videretur multoque choro fatemur
                              mortis animus adoptionem, bello statuat expediunt
                              naturales.
                            </div>
                          </div>
                        </div>

                        <div class="panel">
                          <div class="panel-heading" id="siteMegaAccordionHeadingThree" role="tab">
                            <a class="panel-title collapsed" data-toggle="collapse" href="#siteMegaCollapseThree"
                            data-parent="#siteMegaAccordion" aria-expanded="false"
                            aria-controls="siteMegaCollapseThree">
                                Collapsible Group Item #3
                              </a>
                          </div>
                          <div class="panel-collapse collapse" id="siteMegaCollapseThree" aria-labelledby="siteMegaAccordionHeadingThree"
                          role="tabpanel">
                            <div class="panel-body">
                              Horum, antiquitate perciperet d conspectum locus obruamus animumque perspici probabis
                              suscipere. Desiderat magnum, contenta poena desiderant
                              concederetur menandri damna disputandum corporum.
                            </div>
                          </div>
                        </div>
                      </div>
                      <!-- End Accordion -->
                    </div>
                  </div>
                </div>
              </li>
            </ul>
          </li>
        </ul>
        <!-- End Navbar Toolbar -->

        <!-- Navbar Toolbar Right -->
        <ul class="nav navbar-toolbar navbar-right navbar-toolbar-right">
          <li class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)" data-animation="scale-up"
            aria-expanded="false" role="button">
              <span class="flag-icon flag-icon-us"></span>
            </a>
            <ul class="dropdown-menu" role="menu">
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem">
                  <span class="flag-icon flag-icon-gb"></span> English</a>
              </li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem">
                  <span class="flag-icon flag-icon-fr"></span> French</a>
              </li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem">
                  <span class="flag-icon flag-icon-cn"></span> Chinese</a>
              </li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem">
                  <span class="flag-icon flag-icon-de"></span> German</a>
              </li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem">
                  <span class="flag-icon flag-icon-nl"></span> Dutch</a>
              </li>
            </ul>
          </li>
          <li class="dropdown">
            <a class="navbar-avatar dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false"
            data-animation="scale-up" role="button">
              <span class="avatar avatar-online">
                <img src="../../assets/portraits/5.jpg" alt="...">
                <i></i>
              </span>
            </a>
            <ul class="dropdown-menu" role="menu">
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem"><i class="icon wb-user" aria-hidden="true"></i> Profile</a>
              </li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem"><i class="icon wb-payment" aria-hidden="true"></i> Billing</a>
              </li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem"><i class="icon wb-settings" aria-hidden="true"></i> Settings</a>
              </li>
              <li class="divider" role="presentation"></li>
              <li role="presentation">
                <a href="javascript:void(0)" role="menuitem"><i class="icon wb-power" aria-hidden="true"></i> Logout</a>
              </li>
            </ul>
          </li>
          <li class="dropdown">
            <a data-toggle="dropdown" href="javascript:void(0)" title="Notifications" aria-expanded="false"
            data-animation="scale-up" role="button">
              <i class="icon wb-bell" aria-hidden="true"></i>
              <span class="badge badge-danger up">5</span>
            </a>
            <ul class="dropdown-menu dropdown-menu-right dropdown-menu-media" role="menu">
              <li class="dropdown-menu-header" role="presentation">
                <h5>NOTIFICATIONS</h5>
                <span class="label label-round label-danger">New 5</span>
              </li>

              <li class="list-group" role="presentation">
                <div data-role="container">
                  <div data-role="content">
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <i class="icon wb-order bg-red-600 white icon-circle" aria-hidden="true"></i>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">A new order has been placed</h6>
                          <time class="media-meta" datetime="2015-06-12T20:50:48+08:00">5 hours ago</time>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <i class="icon wb-user bg-green-600 white icon-circle" aria-hidden="true"></i>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Completed the task</h6>
                          <time class="media-meta" datetime="2015-06-11T18:29:20+08:00">2 days ago</time>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <i class="icon wb-settings bg-red-600 white icon-circle" aria-hidden="true"></i>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Settings updated</h6>
                          <time class="media-meta" datetime="2015-06-11T14:05:00+08:00">2 days ago</time>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <i class="icon wb-calendar bg-blue-600 white icon-circle" aria-hidden="true"></i>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Event started</h6>
                          <time class="media-meta" datetime="2015-06-10T13:50:18+08:00">3 days ago</time>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <i class="icon wb-chat bg-orange-600 white icon-circle" aria-hidden="true"></i>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Message received</h6>
                          <time class="media-meta" datetime="2015-06-10T12:34:48+08:00">3 days ago</time>
                        </div>
                      </div>
                    </a>
                  </div>
                </div>
              </li>
              <li class="dropdown-menu-footer" role="presentation">
                <a class="dropdown-menu-footer-btn" href="javascript:void(0)" role="button">
                  <i class="icon wb-settings" aria-hidden="true"></i>
                </a>
                <a href="javascript:void(0)" role="menuitem">
                    All notifications
                  </a>
              </li>
            </ul>
          </li>
          <li class="dropdown">
            <a data-toggle="dropdown" href="javascript:void(0)" title="Messages" aria-expanded="false"
            data-animation="scale-up" role="button">
              <i class="icon wb-envelope" aria-hidden="true"></i>
              <span class="badge badge-info up">3</span>
            </a>
            <ul class="dropdown-menu dropdown-menu-right dropdown-menu-media" role="menu">
              <li class="dropdown-menu-header" role="presentation">
                <h5>MESSAGES</h5>
                <span class="label label-round label-info">New 3</span>
              </li>

              <li class="list-group" role="presentation">
                <div data-role="container">
                  <div data-role="content">
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <span class="avatar avatar-sm avatar-online">
                            <img src="../../assets/portraits/2.jpg" alt="..." />
                            <i></i>
                          </span>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Mary Adams</h6>
                          <div class="media-meta">
                            <time datetime="2015-06-17T20:22:05+08:00">30 minutes ago</time>
                          </div>
                          <div class="media-detail">Anyways, i would like just do it</div>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <span class="avatar avatar-sm avatar-off">
                            <img src="../../assets/portraits/3.jpg" alt="..." />
                            <i></i>
                          </span>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Caleb Richards</h6>
                          <div class="media-meta">
                            <time datetime="2015-06-17T12:30:30+08:00">12 hours ago</time>
                          </div>
                          <div class="media-detail">I checheck the document. But there seems</div>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <span class="avatar avatar-sm avatar-busy">
                            <img src="../../assets/portraits/4.jpg" alt="..." />
                            <i></i>
                          </span>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">June Lane</h6>
                          <div class="media-meta">
                            <time datetime="2015-06-16T18:38:40+08:00">2 days ago</time>
                          </div>
                          <div class="media-detail">Lorem ipsum Id consectetur et minim</div>
                        </div>
                      </div>
                    </a>
                    <a class="list-group-item" href="javascript:void(0)" role="menuitem">
                      <div class="media">
                        <div class="media-left padding-right-10">
                          <span class="avatar avatar-sm avatar-away">
                            <img src="../../assets/portraits/5.jpg" alt="..." />
                            <i></i>
                          </span>
                        </div>
                        <div class="media-body">
                          <h6 class="media-heading">Edward Fletcher</h6>
                          <div class="media-meta">
                            <time datetime="2015-06-15T20:34:48+08:00">3 days ago</time>
                          </div>
                          <div class="media-detail">Dolor et irure cupidatat commodo nostrud nostrud.</div>
                        </div>
                      </div>
                    </a>
                  </div>
                </div>
              </li>
              <li class="dropdown-menu-footer" role="presentation">
                <a class="dropdown-menu-footer-btn" href="javascript:void(0)" role="button">
                  <i class="icon wb-settings" aria-hidden="true"></i>
                </a>
                <a href="javascript:void(0)" role="menuitem">
                    See all messages
                  </a>
              </li>
            </ul>
          </li>
          <li id="toggleChat">
            <a data-toggle="site-sidebar" href="javascript:void(0)" title="Chat" data-url="../../site-sidebar.tpl">
              <i class="icon wb-chat" aria-hidden="true"></i>
            </a>
          </li>
        </ul>
        <!-- End Navbar Toolbar Right -->
      </div>
      <!-- End Navbar Collapse -->

      <!-- Site Navbar Seach -->
      <div class="collapse navbar-search-overlap" id="site-navbar-search">
        <form role="search">
          <div class="form-group">
            <div class="input-search">
              <i class="input-search-icon wb-search" aria-hidden="true"></i>
              <input type="text" class="form-control" name="site-search" placeholder="Search...">
              <button type="button" class="input-search-close icon wb-close" data-target="#site-navbar-search"
              data-toggle="collapse" aria-label="Close"></button>
            </div>
          </div>
        </form>
      </div>
      <!-- End Site Navbar Seach -->
    </div>
  </nav>
  <div class="site-menubar">
    <div class="site-menubar-body">
      <div>
        <div>
          <ul class="site-menu">
            <li class="site-menu-category">General</li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="dashboard">
                <i class="site-menu-icon wb-dashboard" aria-hidden="true"></i>
                <span class="site-menu-title">Dashboard</span>
                <div class="site-menu-badge">
                  <span class="badge badge-success">2</span>
                </div>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../index.html" data-slug="dashboard-v1">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Dashboard v1</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../dashboard/v2.html" data-slug="dashboard-v2">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Dashboard v2</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="layout">
                <i class="site-menu-icon wb-layout" aria-hidden="true"></i>
                <span class="site-menu-title">Layouts</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/menu-collapsed.html" data-slug="layout-menu-collapsed">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Menu Collapsed</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/menu-expended.html" data-slug="layout-menu-expended">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Menu Expended</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/grids.html" data-slug="layout-grids">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Grid Scaffolding</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/headers.html" data-slug="layout-headers">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Different Headers</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/panel-transition.html" data-slug="layout-panel-transition">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Panel Transition</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/boxed.html" data-slug="layout-boxed">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Boxed Layout</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/two-columns.html" data-slug="layout-two-columns">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Two Columns</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/menubar-flipped.html" data-slug="layout-menubar-flipped">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Menubar Flipped</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/menubar-native-scrolling.html" data-slug="layout-menubar-native-scrolling">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Menubar Native Scrolling</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../layouts/bordered-header.html" data-slug="layout-bordered-header">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Bordered Header</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="page">
                <i class="site-menu-icon wb-file" aria-hidden="true"></i>
                <span class="site-menu-title">Pages</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item has-sub">
                  <a href="javascript:void(0)" data-slug="">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Errors</span>
                    <span class="site-menu-arrow"></span>
                  </a>
                  <ul class="site-menu-sub">
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/400.html" data-slug="page-error-400">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">400</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/403.html" data-slug="page-error-403">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">403</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/404.html" data-slug="page-error-404">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">404</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/500.html" data-slug="page-error-500">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">500</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/503.html" data-slug="page-error-503">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">503</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/faq.html" data-slug="page-faq">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">FAQ</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/gallery.html" data-slug="page-gallery">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Gallery</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/gallery-grid.html" data-slug="page-gallery-grid">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Gallery Grid</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/search-result.html" data-slug="page-search-result">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Search Result</span>
                  </a>
                </li>
                <li class="site-menu-item has-sub">
                  <a href="javascript:void(0)" data-slug="page-map">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Maps</span>
                    <span class="site-menu-arrow"></span>
                  </a>
                  <ul class="site-menu-sub">
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/map-google.html" data-slug="page-map-google">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Google Maps</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../pages/map-vector.html" data-slug="page-map-vector">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Vector Maps</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/maintenance.html" data-slug="page-maintenance">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Maintenance</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/forgot-password.html" data-slug="page-forgot-password">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Forgot Password</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/lockscreen.html" data-slug="page-lockscreen">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Lockscreen</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/login.html" data-slug="page-login">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Login</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/register.html" data-slug="page-register">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Register</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/login-v2.html" data-slug="page-login-v2">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Login V2</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/register-v2.html" data-slug="page-register-v2">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Register V2</span>
                    <div class="site-menu-label">
                      <span class="label label-info label-round">new</span>
                    </div>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/login-v3.html" data-slug="page-login-v3">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Login V3</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/register-v3.html" data-slug="page-register-v3">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Register V3</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/user.html" data-slug="page-user">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">User List</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/invoice.html" data-slug="page-invoice">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Invoice</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/blank.html" data-slug="page-blank">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Blank Page</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/email.html" data-slug="page-email">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Email</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/code-editor.html" data-slug="page-code-editor">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Code Editor</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../pages/profile.html" data-slug="page-profile">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Profile</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-category">Elements</li>
            <li class="site-menu-item has-sub active open">
              <a href="javascript:void(0)" data-slug="uikit">
                <i class="site-menu-icon wb-bookmark" aria-hidden="true"></i>
                <span class="site-menu-title">Basic UI</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item has-sub">
                  <a href="javascript:void(0)" data-slug="uikit-panel">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Panel</span>
                    <span class="site-menu-arrow"></span>
                  </a>
                  <ul class="site-menu-sub">
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../panel-structure.html" data-slug="uikit-panel-structure">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Panel Structure</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../panel-actions.html" data-slug="uikit-panel-actions">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Panel Actions</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../panel-portlets.html" data-slug="uikit-panel-portlets">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Panel Portlets</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../buttons.html" data-slug="uikit-buttons">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Buttons</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../dropdowns.html" data-slug="uikit-dropdowns">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Dropdowns</span>
                  </a>
                </li>
                <li class="site-menu-item active">
                  <a class="animsition-link" href="../icons.html" data-slug="uikit-icons">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Icons</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../list.html" data-slug="uikit-list">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">List</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../tooltip-popover.html" data-slug="uikit-tooltip-popover">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Tooltip &amp; Popover</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../modals.html" data-slug="uikit-modals">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Modals</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../tabs-accordions.html" data-slug="uikit-tabs-accordions">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Tabs &amp; Accordions</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../images.html" data-slug="uikit-images">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Images</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../badges-labels.html" data-slug="uikit-badges-labels">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Badges &amp; Labels</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../progress-bars.html" data-slug="uikit-progress-bars">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Progress Bars</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../carousel.html" data-slug="uikit-carousel">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Carousel</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../typography.html" data-slug="uikit-typography">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Typography</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../colors.html" data-slug="uikit-colors">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Colors</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../utilities.html" data-slug="uikit-utilities">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Utilties</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="advanced">
                <i class="site-menu-icon wb-hammer" aria-hidden="true"></i>
                <span class="site-menu-title">Advanced UI</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item hidden-xs">
                  <a href="javascript:void(0)" data-slug="advanced-tour">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Tour</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/animation.html" data-slug="advanced-animation">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Animation</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/highlight.html" data-slug="advanced-highlight">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Highlight</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/lightbox.html" data-slug="advanced-lightbox">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Lightbox</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/scrollable.html" data-slug="advanced-scrollable">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Scrollable</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/rating.html" data-slug="advanced-rating">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Rating</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/context-menu.html" data-slug="advanced-context-menu">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Context Menu</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/alertify.html" data-slug="advanced-alertify">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Alertify</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/masonry.html" data-slug="advanced-masonry">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Masonry</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/treeview.html" data-slug="advanced-treeview">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Treeview</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/toastr.html" data-slug="advanced-toastr">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Toastr</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/maps-vector.html" data-slug="advanced-maps-vector">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Vector Maps</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/maps-google.html" data-slug="advanced-maps-google">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Google Maps</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/sortable-nestable.html" data-slug="advanced-sortable-nestable">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Sortable &amp; Nestable</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../advanced/bootbox-sweetalert.html" data-slug="advanced-bootbox-sweetalert">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Bootbox &amp; Sweetalert</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="structure">
                <i class="site-menu-icon wb-plugin" aria-hidden="true"></i>
                <span class="site-menu-title">Structure</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/alerts.html" data-slug="structure-alerts">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Alerts</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/ribbon.html" data-slug="structure-ribbon">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Ribbon</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/pricing-tables.html" data-slug="structure-pricing-tables">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Pricing Tables</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/overlay.html" data-slug="structure-overlay">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Overlay</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/cover.html" data-slug="structure-cover">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Cover</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/timeline-simple.html" data-slug="structure-timeline-simple">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Simple Timeline</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/timeline.html" data-slug="structure-timeline">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Timeline</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/step.html" data-slug="structure-step">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Step</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/comments.html" data-slug="structure-comments">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Comments</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/media.html" data-slug="structure-media">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Media</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/chat.html" data-slug="structure-chat">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Chat</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/testimonials.html" data-slug="structure-testimonials">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Testimonials</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/nav.html" data-slug="structure-nav">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Nav</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/navbars.html" data-slug="structure-navbars">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Navbars</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/blockquotes.html" data-slug="structure-blockquotes">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Blockquotes</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/pagination.html" data-slug="structure-pagination">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Pagination</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../structure/breadcrumbs.html" data-slug="structure-breadcrumbs">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Breadcrumbs</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="widgets">
                <i class="site-menu-icon wb-extension" aria-hidden="true"></i>
                <span class="site-menu-title">Widgets</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../widgets/statistics.html" data-slug="widgets-statistics">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Statistics Widgets</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../widgets/data.html" data-slug="widgets-data">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Data Widgets</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../widgets/blog.html" data-slug="widgets-blog">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Blog Widgets</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../widgets/chart.html" data-slug="widgets-chart">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Chart Widgets</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../widgets/social.html" data-slug="widgets-social">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Social Widgets</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../widgets/weather.html" data-slug="widgets-weather">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Weather Widgets</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="forms">
                <i class="site-menu-icon wb-library" aria-hidden="true"></i>
                <span class="site-menu-title">Forms</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/general.html" data-slug="forms-general">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">General Elements</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/material.html" data-slug="forms-material">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Material Elements</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/advanced.html" data-slug="forms-advanced">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Advanced Elements</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/layouts.html" data-slug="forms-layouts">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Form Layouts</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/wizard.html" data-slug="forms-wizard">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Form Wizard</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/validation.html" data-slug="forms-validation">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Form Validation</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/masks.html" data-slug="forms-masks">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Form Masks</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/editable.html" data-slug="forms-editable">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Form Editable</span>
                  </a>
                </li>
                <li class="site-menu-item has-sub">
                  <a href="javascript:void(0)" data-slug="forms-editor">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Editors</span>
                    <span class="site-menu-arrow"></span>
                  </a>
                  <ul class="site-menu-sub">
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../forms/editor-summernote.html" data-slug="forms-editor-summernote">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Summernote</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../forms/editor-markdown.html" data-slug="forms-editor-markdown">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Markdown</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../forms/editor-ace.html" data-slug="forms-editor-ace">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Ace Editor</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/image-cropping.html" data-slug="forms-image-cropping">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Image Cropping</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../forms/file-uploads.html" data-slug="forms-file-uploads">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">File Uploads</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="tables">
                <i class="site-menu-icon wb-table" aria-hidden="true"></i>
                <span class="site-menu-title">Tables</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/basic.html" data-slug="tables-basic">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Basic Tables</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/bootstrap.html" data-slug="tables-bootstrap">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Bootstrap Tables</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/floatthead.html" data-slug="tables-floatthead">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">floatThead</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/responsive.html" data-slug="tables-responsive">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Responsive Tables</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/editable.html" data-slug="tables-editable">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Editable Tables</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/footable.html" data-slug="tables-foo">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">FooTable</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../tables/datatable.html" data-slug="tables-datatable">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">DataTables</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="chart">
                <i class="site-menu-icon wb-pie-chart" aria-hidden="true"></i>
                <span class="site-menu-title">Chart</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/chartjs.html" data-slug="chart-chartjs">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Chart.js</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/gauges.html" data-slug="chart-gauges">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Gauges</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/flot.html" data-slug="chart-flot">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Flot</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/peity.html" data-slug="chart-peity">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Peity</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/sparkline.html" data-slug="chart-sparkline">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Sparkline</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/morris.html" data-slug="chart-morris">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Morris</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/chartist.html" data-slug="chart-chartist">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Chartist.js</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/rickshaw.html" data-slug="chart-rickshaw">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Rickshaw</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/pie-progress.html" data-slug="chart-pie-progress">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Pie Progress</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../charts/c3.html" data-slug="chart-c3">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">C3</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-category">Apps</li>
            <li class="site-menu-item has-sub">
              <a href="javascript:void(0)" data-slug="app">
                <i class="site-menu-icon wb-grid-4" aria-hidden="true"></i>
                <span class="site-menu-title">Apps</span>
                <span class="site-menu-arrow"></span>
              </a>
              <ul class="site-menu-sub">
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../apps/contacts/contacts.html" data-slug="app-contacts">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Contacts</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../apps/calendar/calendar.html" data-slug="app-calendar">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Calendar</span>
                  </a>
                </li>
                <li class="site-menu-item has-sub">
                  <a href="javascript:void(0)" data-slug="app-document">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Documents</span>
                    <span class="site-menu-arrow"></span>
                  </a>
                  <ul class="site-menu-sub">
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../apps/documents/articles.html" data-slug="app-document-articles">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Articles</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../apps/documents/categories.html" data-slug="app-document-categories">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Categories</span>
                      </a>
                    </li>
                    <li class="site-menu-item">
                      <a class="animsition-link" href="../../apps/documents/article.html" data-slug="app-document-article">
                        <i class="site-menu-icon " aria-hidden="true"></i>
                        <span class="site-menu-title">Article</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../apps/forum/forum.html" data-slug="app-forum">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Forum</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../apps/projects/projects.html" data-slug="app-projects">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Projects</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../apps/mailbox/mailbox.html" data-slug="app-mailbox">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Mailbox</span>
                  </a>
                </li>
                <li class="site-menu-item">
                  <a class="animsition-link" href="../../apps/media/overview.html" data-slug="app-media">
                    <i class="site-menu-icon " aria-hidden="true"></i>
                    <span class="site-menu-title">Media</span>
                  </a>
                </li>
              </ul>
            </li>
            <li class="site-menu-category">Angular UI</li>
            <li class="site-menu-item">
              <a class="animsition-link" href="../../angular/#/angularui/alert" data-slug="angular">
                <i class="site-menu-icon bd-angular" aria-hidden="true"></i>
                <span class="site-menu-title">Angular UI</span>
                <div class="site-menu-label">
                  <span class="label label-danger label-round">new</span>
                </div>
              </a>
            </li>
          </ul>

          <div class="site-menubar-section">
            <h5>
              Milestone
              <span class="pull-right">30%</span>
            </h5>
            <div class="progress progress-xs">
              <div class="progress-bar active" style="width: 30%;" role="progressbar"></div>
            </div>
            <h5>
              Release
              <span class="pull-right">60%</span>
            </h5>
            <div class="progress progress-xs">
              <div class="progress-bar progress-bar-warning" style="width: 60%;" role="progressbar"></div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="site-menubar-footer">
      <a href="javascript: void(0);" class="fold-show" data-placement="top" data-toggle="tooltip"
      data-original-title="Settings">
        <span class="icon wb-settings" aria-hidden="true"></span>
      </a>
      <a href="javascript: void(0);" data-placement="top" data-toggle="tooltip" data-original-title="Lock">
        <span class="icon wb-eye-close" aria-hidden="true"></span>
      </a>
      <a href="javascript: void(0);" data-placement="top" data-toggle="tooltip" data-original-title="Logout">
        <span class="icon wb-power" aria-hidden="true"></span>
      </a>
    </div>
  </div>
  <div class="site-gridmenu">
    <div>
      <div>
        <ul>
          <li>
            <a href="../../apps/mailbox/mailbox.html">
              <i class="icon wb-envelope"></i>
              <span>Mailbox</span>
            </a>
          </li>
          <li>
            <a href="../../apps/calendar/calendar.html">
              <i class="icon wb-calendar"></i>
              <span>Calendar</span>
            </a>
          </li>
          <li>
            <a href="../../apps/contacts/contacts.html">
              <i class="icon wb-user"></i>
              <span>Contacts</span>
            </a>
          </li>
          <li>
            <a href="../../apps/media/overview.html">
              <i class="icon wb-camera"></i>
              <span>Media</span>
            </a>
          </li>
          <li>
            <a href="../../apps/documents/categories.html">
              <i class="icon wb-order"></i>
              <span>Documents</span>
            </a>
          </li>
          <li>
            <a href="../../apps/projects/projects.html">
              <i class="icon wb-image"></i>
              <span>Project</span>
            </a>
          </li>
          <li>
            <a href="../../apps/forum/forum.html">
              <i class="icon wb-chat-group"></i>
              <span>Forum</span>
            </a>
          </li>
          <li>
            <a href="../../index.html">
              <i class="icon wb-dashboard"></i>
              <span>Dashboard</span>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>


  <div class="page animsition">
    <div class="page-header">
      <ol class="breadcrumb">
        <li><a href="../icons.html">Icons</a></li>
        <li class="active">Font Awesome</li>
      </ol>
      <div class="page-header-actions">
        <a class="btn btn-sm btn-default btn-outline btn-round" href="http://fontawesome.io"
        target="_blank">
          <i class="icon wb-link" aria-hidden="true"></i>
          <span class="hidden-xs">Official Website</span>
        </a>
      </div>
    </div>
    <div class="page-content container-fluid">
      <div class="row padding-vertical-30">
        <div class="col-sm-12 text-center">
          <h2>Search from Font Awesome.</h2>
          <form role="search">
            <div class="input-search">
              <input type="text" class="form-control round" placeholder="Search icon...">
              <button type="submit" class="input-search-btn">
                <i class="icon wb-search" aria-hidden="true"></i>
              </button>
            </div>
          </form>
          <div class="margin-bottom-25">
            <div class="asRange" id="icon_change" data-plugin="asRange" data-namespace="rangeUi"
            data-step="1" data-min="16" data-max="64" data-value="24"></div>
            <span id="icon_size">24px</span>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Web Application Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="adjust">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-adjust" aria-hidden="true"></i>
                <div class="icon-title">adjust</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="anchor">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-anchor" aria-hidden="true"></i>
                <div class="icon-title">anchor</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="archive">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-archive" aria-hidden="true"></i>
                <div class="icon-title">archive</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="area-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-area-chart" aria-hidden="true"></i>
                <div class="icon-title">area-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows" aria-hidden="true"></i>
                <div class="icon-title">arrows</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows-h">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows-h" aria-hidden="true"></i>
                <div class="icon-title">arrows-h</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows-v">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows-v" aria-hidden="true"></i>
                <div class="icon-title">arrows-v</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="asterisk">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-asterisk" aria-hidden="true"></i>
                <div class="icon-title">asterisk</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="at">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-at" aria-hidden="true"></i>
                <div class="icon-title">at</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="automobile">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-automobile" aria-hidden="true"></i>
                <div class="icon-title">automobile</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ban">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ban" aria-hidden="true"></i>
                <div class="icon-title">ban</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bank">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bank" aria-hidden="true"></i>
                <div class="icon-title">bank</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bar-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bar-chart" aria-hidden="true"></i>
                <div class="icon-title">bar-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bar-chart-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bar-chart-o" aria-hidden="true"></i>
                <div class="icon-title">bar-chart-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="barcode">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-barcode" aria-hidden="true"></i>
                <div class="icon-title">barcode</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bars">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bars" aria-hidden="true"></i>
                <div class="icon-title">bars</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bed">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bed" aria-hidden="true"></i>
                <div class="icon-title">bed</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="beer">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-beer" aria-hidden="true"></i>
                <div class="icon-title">beer</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bell">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bell" aria-hidden="true"></i>
                <div class="icon-title">bell</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bell-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bell-o" aria-hidden="true"></i>
                <div class="icon-title">bell-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bell-slash">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bell-slash" aria-hidden="true"></i>
                <div class="icon-title">bell-slash</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bell-slash-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bell-slash-o" aria-hidden="true"></i>
                <div class="icon-title">bell-slash-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bicycle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bicycle" aria-hidden="true"></i>
                <div class="icon-title">bicycle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="binoculars">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-binoculars" aria-hidden="true"></i>
                <div class="icon-title">binoculars</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="birthday-cake">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-birthday-cake" aria-hidden="true"></i>
                <div class="icon-title">birthday-cake</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bolt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bolt" aria-hidden="true"></i>
                <div class="icon-title">bolt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bomb">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bomb" aria-hidden="true"></i>
                <div class="icon-title">bomb</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="book">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-book" aria-hidden="true"></i>
                <div class="icon-title">book</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bookmark">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bookmark" aria-hidden="true"></i>
                <div class="icon-title">bookmark</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bookmark-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bookmark-o" aria-hidden="true"></i>
                <div class="icon-title">bookmark-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="briefcase">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-briefcase" aria-hidden="true"></i>
                <div class="icon-title">briefcase</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bug">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bug" aria-hidden="true"></i>
                <div class="icon-title">bug</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="building">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-building" aria-hidden="true"></i>
                <div class="icon-title">building</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="building-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-building-o" aria-hidden="true"></i>
                <div class="icon-title">building-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bullhorn">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bullhorn" aria-hidden="true"></i>
                <div class="icon-title">bullhorn</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bullseye">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bullseye" aria-hidden="true"></i>
                <div class="icon-title">bullseye</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bus" aria-hidden="true"></i>
                <div class="icon-title">bus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cab">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cab" aria-hidden="true"></i>
                <div class="icon-title">cab</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="calculator">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-calculator" aria-hidden="true"></i>
                <div class="icon-title">calculator</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="calendar">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-calendar" aria-hidden="true"></i>
                <div class="icon-title">calendar</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="calendar-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-calendar-o" aria-hidden="true"></i>
                <div class="icon-title">calendar-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="camera">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-camera" aria-hidden="true"></i>
                <div class="icon-title">camera</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="camera-retro">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-camera-retro" aria-hidden="true"></i>
                <div class="icon-title">camera-retro</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="car">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-car" aria-hidden="true"></i>
                <div class="icon-title">car</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-down" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-left" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-right" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-up" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cart-arrow-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cart-arrow-down" aria-hidden="true"></i>
                <div class="icon-title">cart-arrow-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cart-plus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cart-plus" aria-hidden="true"></i>
                <div class="icon-title">cart-plus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc" aria-hidden="true"></i>
                <div class="icon-title">cc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="certificate">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-certificate" aria-hidden="true"></i>
                <div class="icon-title">certificate</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check" aria-hidden="true"></i>
                <div class="icon-title">check</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check-circle" aria-hidden="true"></i>
                <div class="icon-title">check-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check-circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check-circle-o" aria-hidden="true"></i>
                <div class="icon-title">check-circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check-square" aria-hidden="true"></i>
                <div class="icon-title">check-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check-square-o" aria-hidden="true"></i>
                <div class="icon-title">check-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="child">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-child" aria-hidden="true"></i>
                <div class="icon-title">child</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle" aria-hidden="true"></i>
                <div class="icon-title">circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle-o" aria-hidden="true"></i>
                <div class="icon-title">circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle-o-notch">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle-o-notch" aria-hidden="true"></i>
                <div class="icon-title">circle-o-notch</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle-thin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle-thin" aria-hidden="true"></i>
                <div class="icon-title">circle-thin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="clock-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-clock-o" aria-hidden="true"></i>
                <div class="icon-title">clock-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="close">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-close" aria-hidden="true"></i>
                <div class="icon-title">close</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cloud">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cloud" aria-hidden="true"></i>
                <div class="icon-title">cloud</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cloud-download">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cloud-download" aria-hidden="true"></i>
                <div class="icon-title">cloud-download</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cloud-upload">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cloud-upload" aria-hidden="true"></i>
                <div class="icon-title">cloud-upload</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="code">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-code" aria-hidden="true"></i>
                <div class="icon-title">code</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="code-fork">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-code-fork" aria-hidden="true"></i>
                <div class="icon-title">code-fork</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="coffee">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-coffee" aria-hidden="true"></i>
                <div class="icon-title">coffee</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cog">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cog" aria-hidden="true"></i>
                <div class="icon-title">cog</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cogs">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cogs" aria-hidden="true"></i>
                <div class="icon-title">cogs</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="comment">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-comment" aria-hidden="true"></i>
                <div class="icon-title">comment</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="comment-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-comment-o" aria-hidden="true"></i>
                <div class="icon-title">comment-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="comments">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-comments" aria-hidden="true"></i>
                <div class="icon-title">comments</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="comments-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-comments-o" aria-hidden="true"></i>
                <div class="icon-title">comments-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="compass">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-compass" aria-hidden="true"></i>
                <div class="icon-title">compass</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="copyright">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-copyright" aria-hidden="true"></i>
                <div class="icon-title">copyright</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="credit-card">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-credit-card" aria-hidden="true"></i>
                <div class="icon-title">credit-card</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="crop">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-crop" aria-hidden="true"></i>
                <div class="icon-title">crop</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="crosshairs">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-crosshairs" aria-hidden="true"></i>
                <div class="icon-title">crosshairs</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cube">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cube" aria-hidden="true"></i>
                <div class="icon-title">cube</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cubes">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cubes" aria-hidden="true"></i>
                <div class="icon-title">cubes</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cutlery">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cutlery" aria-hidden="true"></i>
                <div class="icon-title">cutlery</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dashboard">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dashboard" aria-hidden="true"></i>
                <div class="icon-title">dashboard</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="database">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-database" aria-hidden="true"></i>
                <div class="icon-title">database</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="desktop">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-desktop" aria-hidden="true"></i>
                <div class="icon-title">desktop</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="diamond">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-diamond" aria-hidden="true"></i>
                <div class="icon-title">diamond</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dot-circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dot-circle-o" aria-hidden="true"></i>
                <div class="icon-title">dot-circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="download">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-download" aria-hidden="true"></i>
                <div class="icon-title">download</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="edit">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-edit" aria-hidden="true"></i>
                <div class="icon-title">edit</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ellipsis-h">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ellipsis-h" aria-hidden="true"></i>
                <div class="icon-title">ellipsis-h</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ellipsis-v">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ellipsis-v" aria-hidden="true"></i>
                <div class="icon-title">ellipsis-v</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="envelope">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-envelope" aria-hidden="true"></i>
                <div class="icon-title">envelope</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="envelope-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-envelope-o" aria-hidden="true"></i>
                <div class="icon-title">envelope-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="envelope-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-envelope-square" aria-hidden="true"></i>
                <div class="icon-title">envelope-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eraser">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eraser" aria-hidden="true"></i>
                <div class="icon-title">eraser</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="exchange">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-exchange" aria-hidden="true"></i>
                <div class="icon-title">exchange</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="exclamation">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-exclamation" aria-hidden="true"></i>
                <div class="icon-title">exclamation</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="exclamation-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-exclamation-circle" aria-hidden="true"></i>
                <div class="icon-title">exclamation-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="exclamation-triangle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-exclamation-triangle" aria-hidden="true"></i>
                <div class="icon-title">exclamation-triangle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="external-link">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-external-link" aria-hidden="true"></i>
                <div class="icon-title">external-link</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="external-link-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-external-link-square" aria-hidden="true"></i>
                <div class="icon-title">external-link-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eye">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eye" aria-hidden="true"></i>
                <div class="icon-title">eye</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eye-slash">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eye-slash" aria-hidden="true"></i>
                <div class="icon-title">eye-slash</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eyedropper">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eyedropper" aria-hidden="true"></i>
                <div class="icon-title">eyedropper</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fax">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fax" aria-hidden="true"></i>
                <div class="icon-title">fax</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="female">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-female" aria-hidden="true"></i>
                <div class="icon-title">female</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fighter-jet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fighter-jet" aria-hidden="true"></i>
                <div class="icon-title">fighter-jet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-archive-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-archive-o" aria-hidden="true"></i>
                <div class="icon-title">file-archive-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-audio-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-audio-o" aria-hidden="true"></i>
                <div class="icon-title">file-audio-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-code-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-code-o" aria-hidden="true"></i>
                <div class="icon-title">file-code-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-excel-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-excel-o" aria-hidden="true"></i>
                <div class="icon-title">file-excel-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-image-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-image-o" aria-hidden="true"></i>
                <div class="icon-title">file-image-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-movie-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-movie-o" aria-hidden="true"></i>
                <div class="icon-title">file-movie-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-pdf-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-pdf-o" aria-hidden="true"></i>
                <div class="icon-title">file-pdf-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-photo-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-photo-o" aria-hidden="true"></i>
                <div class="icon-title">file-photo-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-picture-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-picture-o" aria-hidden="true"></i>
                <div class="icon-title">file-picture-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-powerpoint-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-powerpoint-o" aria-hidden="true"></i>
                <div class="icon-title">file-powerpoint-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-sound-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-sound-o" aria-hidden="true"></i>
                <div class="icon-title">file-sound-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-video-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-video-o" aria-hidden="true"></i>
                <div class="icon-title">file-video-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-word-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-word-o" aria-hidden="true"></i>
                <div class="icon-title">file-word-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-zip-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-zip-o" aria-hidden="true"></i>
                <div class="icon-title">file-zip-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="film">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-film" aria-hidden="true"></i>
                <div class="icon-title">film</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="filter">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-filter" aria-hidden="true"></i>
                <div class="icon-title">filter</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fire">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fire" aria-hidden="true"></i>
                <div class="icon-title">fire</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fire-extinguisher">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fire-extinguisher" aria-hidden="true"></i>
                <div class="icon-title">fire-extinguisher</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="flag">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-flag" aria-hidden="true"></i>
                <div class="icon-title">flag</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="flag-checkered">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-flag-checkered" aria-hidden="true"></i>
                <div class="icon-title">flag-checkered</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="flag-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-flag-o" aria-hidden="true"></i>
                <div class="icon-title">flag-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="flash">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-flash" aria-hidden="true"></i>
                <div class="icon-title">flash</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="flask">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-flask" aria-hidden="true"></i>
                <div class="icon-title">flask</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="folder">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-folder" aria-hidden="true"></i>
                <div class="icon-title">folder</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="folder-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-folder-o" aria-hidden="true"></i>
                <div class="icon-title">folder-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="folder-open">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-folder-open" aria-hidden="true"></i>
                <div class="icon-title">folder-open</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="folder-open-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-folder-open-o" aria-hidden="true"></i>
                <div class="icon-title">folder-open-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="frown-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-frown-o" aria-hidden="true"></i>
                <div class="icon-title">frown-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="futbol-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-futbol-o" aria-hidden="true"></i>
                <div class="icon-title">futbol-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gamepad">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gamepad" aria-hidden="true"></i>
                <div class="icon-title">gamepad</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gavel">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gavel" aria-hidden="true"></i>
                <div class="icon-title">gavel</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gear">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gear" aria-hidden="true"></i>
                <div class="icon-title">gear</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gears">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gears" aria-hidden="true"></i>
                <div class="icon-title">gears</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="genderless">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-genderless" aria-hidden="true"></i>
                <div class="icon-title">genderless</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gift">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gift" aria-hidden="true"></i>
                <div class="icon-title">gift</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="glass">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-glass" aria-hidden="true"></i>
                <div class="icon-title">glass</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="globe">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-globe" aria-hidden="true"></i>
                <div class="icon-title">globe</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="graduation-cap">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-graduation-cap" aria-hidden="true"></i>
                <div class="icon-title">graduation-cap</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="group">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-group" aria-hidden="true"></i>
                <div class="icon-title">group</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hdd-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hdd-o" aria-hidden="true"></i>
                <div class="icon-title">hdd-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="headphones">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-headphones" aria-hidden="true"></i>
                <div class="icon-title">headphones</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="heart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-heart" aria-hidden="true"></i>
                <div class="icon-title">heart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="heart-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-heart-o" aria-hidden="true"></i>
                <div class="icon-title">heart-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="heartbeat">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-heartbeat" aria-hidden="true"></i>
                <div class="icon-title">heartbeat</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="history">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-history" aria-hidden="true"></i>
                <div class="icon-title">history</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="home">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-home" aria-hidden="true"></i>
                <div class="icon-title">home</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hotel">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hotel" aria-hidden="true"></i>
                <div class="icon-title">hotel</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="image">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-image" aria-hidden="true"></i>
                <div class="icon-title">image</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="inbox">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-inbox" aria-hidden="true"></i>
                <div class="icon-title">inbox</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="info">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-info" aria-hidden="true"></i>
                <div class="icon-title">info</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="info-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-info-circle" aria-hidden="true"></i>
                <div class="icon-title">info-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="institution">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-institution" aria-hidden="true"></i>
                <div class="icon-title">institution</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="key">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-key" aria-hidden="true"></i>
                <div class="icon-title">key</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="keyboard-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-keyboard-o" aria-hidden="true"></i>
                <div class="icon-title">keyboard-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="language">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-language" aria-hidden="true"></i>
                <div class="icon-title">language</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="laptop">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-laptop" aria-hidden="true"></i>
                <div class="icon-title">laptop</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="leaf">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-leaf" aria-hidden="true"></i>
                <div class="icon-title">leaf</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="legal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-legal" aria-hidden="true"></i>
                <div class="icon-title">legal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="lemon-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-lemon-o" aria-hidden="true"></i>
                <div class="icon-title">lemon-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="level-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-level-down" aria-hidden="true"></i>
                <div class="icon-title">level-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="level-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-level-up" aria-hidden="true"></i>
                <div class="icon-title">level-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="life-bouy">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-life-bouy" aria-hidden="true"></i>
                <div class="icon-title">life-bouy</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="life-buoy">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-life-buoy" aria-hidden="true"></i>
                <div class="icon-title">life-buoy</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="life-ring">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-life-ring" aria-hidden="true"></i>
                <div class="icon-title">life-ring</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="life-saver">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-life-saver" aria-hidden="true"></i>
                <div class="icon-title">life-saver</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="lightbulb-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-lightbulb-o" aria-hidden="true"></i>
                <div class="icon-title">lightbulb-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="line-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-line-chart" aria-hidden="true"></i>
                <div class="icon-title">line-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="location-arrow">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-location-arrow" aria-hidden="true"></i>
                <div class="icon-title">location-arrow</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="lock">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-lock" aria-hidden="true"></i>
                <div class="icon-title">lock</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="magic">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-magic" aria-hidden="true"></i>
                <div class="icon-title">magic</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="magnet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-magnet" aria-hidden="true"></i>
                <div class="icon-title">magnet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mail-forward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mail-forward" aria-hidden="true"></i>
                <div class="icon-title">mail-forward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mail-reply">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mail-reply" aria-hidden="true"></i>
                <div class="icon-title">mail-reply</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mail-reply-all">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mail-reply-all" aria-hidden="true"></i>
                <div class="icon-title">mail-reply-all</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="male">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-male" aria-hidden="true"></i>
                <div class="icon-title">male</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="map-marker">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-map-marker" aria-hidden="true"></i>
                <div class="icon-title">map-marker</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="meh-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-meh-o" aria-hidden="true"></i>
                <div class="icon-title">meh-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="microphone">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-microphone" aria-hidden="true"></i>
                <div class="icon-title">microphone</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="microphone-slash">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-microphone-slash" aria-hidden="true"></i>
                <div class="icon-title">microphone-slash</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="minus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-minus" aria-hidden="true"></i>
                <div class="icon-title">minus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="minus-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-minus-circle" aria-hidden="true"></i>
                <div class="icon-title">minus-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="minus-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-minus-square" aria-hidden="true"></i>
                <div class="icon-title">minus-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="minus-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-minus-square-o" aria-hidden="true"></i>
                <div class="icon-title">minus-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mobile">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mobile" aria-hidden="true"></i>
                <div class="icon-title">mobile</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mobile-phone">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mobile-phone" aria-hidden="true"></i>
                <div class="icon-title">mobile-phone</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="money">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-money" aria-hidden="true"></i>
                <div class="icon-title">money</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="moon-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-moon-o" aria-hidden="true"></i>
                <div class="icon-title">moon-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mortar-board">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mortar-board" aria-hidden="true"></i>
                <div class="icon-title">mortar-board</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="motorcycle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-motorcycle" aria-hidden="true"></i>
                <div class="icon-title">motorcycle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="music">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-music" aria-hidden="true"></i>
                <div class="icon-title">music</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="navicon">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-navicon" aria-hidden="true"></i>
                <div class="icon-title">navicon</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="newspaper-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-newspaper-o" aria-hidden="true"></i>
                <div class="icon-title">newspaper-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paint-brush">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paint-brush" aria-hidden="true"></i>
                <div class="icon-title">paint-brush</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paper-plane">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paper-plane" aria-hidden="true"></i>
                <div class="icon-title">paper-plane</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paper-plane-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paper-plane-o" aria-hidden="true"></i>
                <div class="icon-title">paper-plane-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paw">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paw" aria-hidden="true"></i>
                <div class="icon-title">paw</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pencil">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pencil" aria-hidden="true"></i>
                <div class="icon-title">pencil</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pencil-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pencil-square" aria-hidden="true"></i>
                <div class="icon-title">pencil-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pencil-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pencil-square-o" aria-hidden="true"></i>
                <div class="icon-title">pencil-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="phone">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-phone" aria-hidden="true"></i>
                <div class="icon-title">phone</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="phone-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-phone-square" aria-hidden="true"></i>
                <div class="icon-title">phone-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="photo">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-photo" aria-hidden="true"></i>
                <div class="icon-title">photo</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="picture-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-picture-o" aria-hidden="true"></i>
                <div class="icon-title">picture-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pie-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pie-chart" aria-hidden="true"></i>
                <div class="icon-title">pie-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plane">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plane" aria-hidden="true"></i>
                <div class="icon-title">plane</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plug">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plug" aria-hidden="true"></i>
                <div class="icon-title">plug</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus" aria-hidden="true"></i>
                <div class="icon-title">plus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus-circle" aria-hidden="true"></i>
                <div class="icon-title">plus-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus-square" aria-hidden="true"></i>
                <div class="icon-title">plus-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus-square-o" aria-hidden="true"></i>
                <div class="icon-title">plus-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="power-off">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-power-off" aria-hidden="true"></i>
                <div class="icon-title">power-off</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="print">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-print" aria-hidden="true"></i>
                <div class="icon-title">print</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="puzzle-piece">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-puzzle-piece" aria-hidden="true"></i>
                <div class="icon-title">puzzle-piece</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="qrcode">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-qrcode" aria-hidden="true"></i>
                <div class="icon-title">qrcode</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="question">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-question" aria-hidden="true"></i>
                <div class="icon-title">question</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="question-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-question-circle" aria-hidden="true"></i>
                <div class="icon-title">question-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="quote-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-quote-left" aria-hidden="true"></i>
                <div class="icon-title">quote-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="quote-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-quote-right" aria-hidden="true"></i>
                <div class="icon-title">quote-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="random">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-random" aria-hidden="true"></i>
                <div class="icon-title">random</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="recycle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-recycle" aria-hidden="true"></i>
                <div class="icon-title">recycle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="refresh">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-refresh" aria-hidden="true"></i>
                <div class="icon-title">refresh</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="remove">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-remove" aria-hidden="true"></i>
                <div class="icon-title">remove</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="reorder">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-reorder" aria-hidden="true"></i>
                <div class="icon-title">reorder</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="reply">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-reply" aria-hidden="true"></i>
                <div class="icon-title">reply</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="reply-all">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-reply-all" aria-hidden="true"></i>
                <div class="icon-title">reply-all</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="retweet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-retweet" aria-hidden="true"></i>
                <div class="icon-title">retweet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="road">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-road" aria-hidden="true"></i>
                <div class="icon-title">road</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rocket">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rocket" aria-hidden="true"></i>
                <div class="icon-title">rocket</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rss">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rss" aria-hidden="true"></i>
                <div class="icon-title">rss</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rss-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rss-square" aria-hidden="true"></i>
                <div class="icon-title">rss-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="search">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-search" aria-hidden="true"></i>
                <div class="icon-title">search</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="search-minus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-search-minus" aria-hidden="true"></i>
                <div class="icon-title">search-minus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="search-plus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-search-plus" aria-hidden="true"></i>
                <div class="icon-title">search-plus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="send">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-send" aria-hidden="true"></i>
                <div class="icon-title">send</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="send-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-send-o" aria-hidden="true"></i>
                <div class="icon-title">send-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="server">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-server" aria-hidden="true"></i>
                <div class="icon-title">server</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share" aria-hidden="true"></i>
                <div class="icon-title">share</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share-alt" aria-hidden="true"></i>
                <div class="icon-title">share-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share-alt-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share-alt-square" aria-hidden="true"></i>
                <div class="icon-title">share-alt-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share-square" aria-hidden="true"></i>
                <div class="icon-title">share-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share-square-o" aria-hidden="true"></i>
                <div class="icon-title">share-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="shield">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-shield" aria-hidden="true"></i>
                <div class="icon-title">shield</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ship">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ship" aria-hidden="true"></i>
                <div class="icon-title">ship</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="shopping-cart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-shopping-cart" aria-hidden="true"></i>
                <div class="icon-title">shopping-cart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sign-in">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sign-in" aria-hidden="true"></i>
                <div class="icon-title">sign-in</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sign-out">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sign-out" aria-hidden="true"></i>
                <div class="icon-title">sign-out</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="signal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-signal" aria-hidden="true"></i>
                <div class="icon-title">signal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sitemap">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sitemap" aria-hidden="true"></i>
                <div class="icon-title">sitemap</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sliders">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sliders" aria-hidden="true"></i>
                <div class="icon-title">sliders</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="smile-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-smile-o" aria-hidden="true"></i>
                <div class="icon-title">smile-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="soccer-ball-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-soccer-ball-o" aria-hidden="true"></i>
                <div class="icon-title">soccer-ball-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort" aria-hidden="true"></i>
                <div class="icon-title">sort</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-alpha-asc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-alpha-asc" aria-hidden="true"></i>
                <div class="icon-title">sort-alpha-asc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-alpha-desc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-alpha-desc" aria-hidden="true"></i>
                <div class="icon-title">sort-alpha-desc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-amount-asc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-amount-asc" aria-hidden="true"></i>
                <div class="icon-title">sort-amount-asc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-amount-desc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-amount-desc" aria-hidden="true"></i>
                <div class="icon-title">sort-amount-desc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-asc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-asc" aria-hidden="true"></i>
                <div class="icon-title">sort-asc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-desc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-desc" aria-hidden="true"></i>
                <div class="icon-title">sort-desc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-down" aria-hidden="true"></i>
                <div class="icon-title">sort-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-numeric-asc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-numeric-asc" aria-hidden="true"></i>
                <div class="icon-title">sort-numeric-asc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-numeric-desc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-numeric-desc" aria-hidden="true"></i>
                <div class="icon-title">sort-numeric-desc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sort-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sort-up" aria-hidden="true"></i>
                <div class="icon-title">sort-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="space-shuttle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-space-shuttle" aria-hidden="true"></i>
                <div class="icon-title">space-shuttle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="spinner">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-spinner" aria-hidden="true"></i>
                <div class="icon-title">spinner</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="spoon">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-spoon" aria-hidden="true"></i>
                <div class="icon-title">spoon</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-square" aria-hidden="true"></i>
                <div class="icon-title">square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-square-o" aria-hidden="true"></i>
                <div class="icon-title">square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="star">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-star" aria-hidden="true"></i>
                <div class="icon-title">star</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="star-half">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-star-half" aria-hidden="true"></i>
                <div class="icon-title">star-half</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="star-half-empty">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-star-half-empty" aria-hidden="true"></i>
                <div class="icon-title">star-half-empty</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="star-half-full">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-star-half-full" aria-hidden="true"></i>
                <div class="icon-title">star-half-full</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="star-half-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-star-half-o" aria-hidden="true"></i>
                <div class="icon-title">star-half-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="star-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-star-o" aria-hidden="true"></i>
                <div class="icon-title">star-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="street-view">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-street-view" aria-hidden="true"></i>
                <div class="icon-title">street-view</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="suitcase">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-suitcase" aria-hidden="true"></i>
                <div class="icon-title">suitcase</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sun-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sun-o" aria-hidden="true"></i>
                <div class="icon-title">sun-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="support">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-support" aria-hidden="true"></i>
                <div class="icon-title">support</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tablet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tablet" aria-hidden="true"></i>
                <div class="icon-title">tablet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tachometer">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tachometer" aria-hidden="true"></i>
                <div class="icon-title">tachometer</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tag">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tag" aria-hidden="true"></i>
                <div class="icon-title">tag</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tags">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tags" aria-hidden="true"></i>
                <div class="icon-title">tags</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tasks">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tasks" aria-hidden="true"></i>
                <div class="icon-title">tasks</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="taxi">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-taxi" aria-hidden="true"></i>
                <div class="icon-title">taxi</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="terminal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-terminal" aria-hidden="true"></i>
                <div class="icon-title">terminal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="thumb-tack">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-thumb-tack" aria-hidden="true"></i>
                <div class="icon-title">thumb-tack</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="thumbs-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-thumbs-down" aria-hidden="true"></i>
                <div class="icon-title">thumbs-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="thumbs-o-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-thumbs-o-down" aria-hidden="true"></i>
                <div class="icon-title">thumbs-o-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="thumbs-o-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-thumbs-o-up" aria-hidden="true"></i>
                <div class="icon-title">thumbs-o-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="thumbs-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-thumbs-up" aria-hidden="true"></i>
                <div class="icon-title">thumbs-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ticket">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ticket" aria-hidden="true"></i>
                <div class="icon-title">ticket</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="times">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-times" aria-hidden="true"></i>
                <div class="icon-title">times</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="times-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-times-circle" aria-hidden="true"></i>
                <div class="icon-title">times-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="times-circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-times-circle-o" aria-hidden="true"></i>
                <div class="icon-title">times-circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tint">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tint" aria-hidden="true"></i>
                <div class="icon-title">tint</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-down" aria-hidden="true"></i>
                <div class="icon-title">toggle-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-left" aria-hidden="true"></i>
                <div class="icon-title">toggle-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-off">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-off" aria-hidden="true"></i>
                <div class="icon-title">toggle-off</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-on">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-on" aria-hidden="true"></i>
                <div class="icon-title">toggle-on</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-right" aria-hidden="true"></i>
                <div class="icon-title">toggle-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-up" aria-hidden="true"></i>
                <div class="icon-title">toggle-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="trash">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-trash" aria-hidden="true"></i>
                <div class="icon-title">trash</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="trash-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-trash-o" aria-hidden="true"></i>
                <div class="icon-title">trash-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tree">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tree" aria-hidden="true"></i>
                <div class="icon-title">tree</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="trophy">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-trophy" aria-hidden="true"></i>
                <div class="icon-title">trophy</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="truck">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-truck" aria-hidden="true"></i>
                <div class="icon-title">truck</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tty">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tty" aria-hidden="true"></i>
                <div class="icon-title">tty</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="umbrella">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-umbrella" aria-hidden="true"></i>
                <div class="icon-title">umbrella</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="university">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-university" aria-hidden="true"></i>
                <div class="icon-title">university</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="unlock">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-unlock" aria-hidden="true"></i>
                <div class="icon-title">unlock</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="unlock-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-unlock-alt" aria-hidden="true"></i>
                <div class="icon-title">unlock-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="unsorted">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-unsorted" aria-hidden="true"></i>
                <div class="icon-title">unsorted</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="upload">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-upload" aria-hidden="true"></i>
                <div class="icon-title">upload</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="user">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-user" aria-hidden="true"></i>
                <div class="icon-title">user</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="user-plus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-user-plus" aria-hidden="true"></i>
                <div class="icon-title">user-plus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="user-secret">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-user-secret" aria-hidden="true"></i>
                <div class="icon-title">user-secret</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="user-times">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-user-times" aria-hidden="true"></i>
                <div class="icon-title">user-times</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="users">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-users" aria-hidden="true"></i>
                <div class="icon-title">users</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="video-camera">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-video-camera" aria-hidden="true"></i>
                <div class="icon-title">video-camera</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="volume-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-volume-down" aria-hidden="true"></i>
                <div class="icon-title">volume-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="volume-off">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-volume-off" aria-hidden="true"></i>
                <div class="icon-title">volume-off</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="volume-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-volume-up" aria-hidden="true"></i>
                <div class="icon-title">volume-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="warning">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-warning" aria-hidden="true"></i>
                <div class="icon-title">warning</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wheelchair">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wheelchair" aria-hidden="true"></i>
                <div class="icon-title">wheelchair</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wifi">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wifi" aria-hidden="true"></i>
                <div class="icon-title">wifi</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wrench">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wrench" aria-hidden="true"></i>
                <div class="icon-title">wrench</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Transportation Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ambulance">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ambulance" aria-hidden="true"></i>
                <div class="icon-title">ambulance</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="automobile">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-automobile" aria-hidden="true"></i>
                <div class="icon-title">automobile</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bicycle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bicycle" aria-hidden="true"></i>
                <div class="icon-title">bicycle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bus" aria-hidden="true"></i>
                <div class="icon-title">bus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cab">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cab" aria-hidden="true"></i>
                <div class="icon-title">cab</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="car">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-car" aria-hidden="true"></i>
                <div class="icon-title">car</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fighter-jet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fighter-jet" aria-hidden="true"></i>
                <div class="icon-title">fighter-jet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="motorcycle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-motorcycle" aria-hidden="true"></i>
                <div class="icon-title">motorcycle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plane">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plane" aria-hidden="true"></i>
                <div class="icon-title">plane</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rocket">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rocket" aria-hidden="true"></i>
                <div class="icon-title">rocket</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ship">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ship" aria-hidden="true"></i>
                <div class="icon-title">ship</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="space-shuttle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-space-shuttle" aria-hidden="true"></i>
                <div class="icon-title">space-shuttle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="subway">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-subway" aria-hidden="true"></i>
                <div class="icon-title">subway</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="taxi">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-taxi" aria-hidden="true"></i>
                <div class="icon-title">taxi</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="train">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-train" aria-hidden="true"></i>
                <div class="icon-title">train</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="truck">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-truck" aria-hidden="true"></i>
                <div class="icon-title">truck</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wheelchair">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wheelchair" aria-hidden="true"></i>
                <div class="icon-title">wheelchair</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Gender Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle-thin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle-thin" aria-hidden="true"></i>
                <div class="icon-title">circle-thin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="genderless">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-genderless" aria-hidden="true"></i>
                <div class="icon-title">genderless</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mars">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mars" aria-hidden="true"></i>
                <div class="icon-title">mars</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mars-double">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mars-double" aria-hidden="true"></i>
                <div class="icon-title">mars-double</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mars-stroke">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mars-stroke" aria-hidden="true"></i>
                <div class="icon-title">mars-stroke</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mars-stroke-h">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mars-stroke-h" aria-hidden="true"></i>
                <div class="icon-title">mars-stroke-h</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mars-stroke-v">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mars-stroke-v" aria-hidden="true"></i>
                <div class="icon-title">mars-stroke-v</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="mercury">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-mercury" aria-hidden="true"></i>
                <div class="icon-title">mercury</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="neuter">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-neuter" aria-hidden="true"></i>
                <div class="icon-title">neuter</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="transgender">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-transgender" aria-hidden="true"></i>
                <div class="icon-title">transgender</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="transgender-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-transgender-alt" aria-hidden="true"></i>
                <div class="icon-title">transgender-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="venus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-venus" aria-hidden="true"></i>
                <div class="icon-title">venus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="venus-double">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-venus-double" aria-hidden="true"></i>
                <div class="icon-title">venus-double</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="venus-mars">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-venus-mars" aria-hidden="true"></i>
                <div class="icon-title">venus-mars</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">File Type Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file" aria-hidden="true"></i>
                <div class="icon-title">file</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-archive-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-archive-o" aria-hidden="true"></i>
                <div class="icon-title">file-archive-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-audio-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-audio-o" aria-hidden="true"></i>
                <div class="icon-title">file-audio-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-code-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-code-o" aria-hidden="true"></i>
                <div class="icon-title">file-code-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-excel-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-excel-o" aria-hidden="true"></i>
                <div class="icon-title">file-excel-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-image-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-image-o" aria-hidden="true"></i>
                <div class="icon-title">file-image-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-movie-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-movie-o" aria-hidden="true"></i>
                <div class="icon-title">file-movie-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-o" aria-hidden="true"></i>
                <div class="icon-title">file-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-pdf-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-pdf-o" aria-hidden="true"></i>
                <div class="icon-title">file-pdf-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-photo-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-photo-o" aria-hidden="true"></i>
                <div class="icon-title">file-photo-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-picture-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-picture-o" aria-hidden="true"></i>
                <div class="icon-title">file-picture-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-powerpoint-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-powerpoint-o" aria-hidden="true"></i>
                <div class="icon-title">file-powerpoint-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-sound-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-sound-o" aria-hidden="true"></i>
                <div class="icon-title">file-sound-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-text">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-text" aria-hidden="true"></i>
                <div class="icon-title">file-text</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-text-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-text-o" aria-hidden="true"></i>
                <div class="icon-title">file-text-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-video-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-video-o" aria-hidden="true"></i>
                <div class="icon-title">file-video-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-word-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-word-o" aria-hidden="true"></i>
                <div class="icon-title">file-word-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-zip-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-zip-o" aria-hidden="true"></i>
                <div class="icon-title">file-zip-o</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Spinner Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle-o-notch">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle-o-notch" aria-hidden="true"></i>
                <div class="icon-title">circle-o-notch</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cog">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cog" aria-hidden="true"></i>
                <div class="icon-title">cog</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gear">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gear" aria-hidden="true"></i>
                <div class="icon-title">gear</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="refresh">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-refresh" aria-hidden="true"></i>
                <div class="icon-title">refresh</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="spinner">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-spinner" aria-hidden="true"></i>
                <div class="icon-title">spinner</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Form Control Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check-square" aria-hidden="true"></i>
                <div class="icon-title">check-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="check-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-check-square-o" aria-hidden="true"></i>
                <div class="icon-title">check-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle" aria-hidden="true"></i>
                <div class="icon-title">circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-circle-o" aria-hidden="true"></i>
                <div class="icon-title">circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dot-circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dot-circle-o" aria-hidden="true"></i>
                <div class="icon-title">dot-circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="minus-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-minus-square" aria-hidden="true"></i>
                <div class="icon-title">minus-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="minus-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-minus-square-o" aria-hidden="true"></i>
                <div class="icon-title">minus-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus-square" aria-hidden="true"></i>
                <div class="icon-title">plus-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus-square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus-square-o" aria-hidden="true"></i>
                <div class="icon-title">plus-square-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-square" aria-hidden="true"></i>
                <div class="icon-title">square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="square-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-square-o" aria-hidden="true"></i>
                <div class="icon-title">square-o</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Payment Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-amex">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-amex" aria-hidden="true"></i>
                <div class="icon-title">cc-amex</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-discover">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-discover" aria-hidden="true"></i>
                <div class="icon-title">cc-discover</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-mastercard">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-mastercard" aria-hidden="true"></i>
                <div class="icon-title">cc-mastercard</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-paypal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-paypal" aria-hidden="true"></i>
                <div class="icon-title">cc-paypal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-stripe">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-stripe" aria-hidden="true"></i>
                <div class="icon-title">cc-stripe</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-visa">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-visa" aria-hidden="true"></i>
                <div class="icon-title">cc-visa</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="credit-card">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-credit-card" aria-hidden="true"></i>
                <div class="icon-title">credit-card</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="google-wallet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-google-wallet" aria-hidden="true"></i>
                <div class="icon-title">google-wallet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paypal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paypal" aria-hidden="true"></i>
                <div class="icon-title">paypal</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Chart Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="area-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-area-chart" aria-hidden="true"></i>
                <div class="icon-title">area-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bar-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bar-chart" aria-hidden="true"></i>
                <div class="icon-title">bar-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bar-chart-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bar-chart-o" aria-hidden="true"></i>
                <div class="icon-title">bar-chart-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="line-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-line-chart" aria-hidden="true"></i>
                <div class="icon-title">line-chart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pie-chart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pie-chart" aria-hidden="true"></i>
                <div class="icon-title">pie-chart</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Currency Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bitcoin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bitcoin" aria-hidden="true"></i>
                <div class="icon-title">bitcoin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="btc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-btc" aria-hidden="true"></i>
                <div class="icon-title">btc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cny">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cny" aria-hidden="true"></i>
                <div class="icon-title">cny</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dollar">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dollar" aria-hidden="true"></i>
                <div class="icon-title">dollar</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eur">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eur" aria-hidden="true"></i>
                <div class="icon-title">eur</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="euro">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-euro" aria-hidden="true"></i>
                <div class="icon-title">euro</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gbp">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gbp" aria-hidden="true"></i>
                <div class="icon-title">gbp</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ils">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ils" aria-hidden="true"></i>
                <div class="icon-title">ils</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="inr">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-inr" aria-hidden="true"></i>
                <div class="icon-title">inr</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="jpy">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-jpy" aria-hidden="true"></i>
                <div class="icon-title">jpy</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="krw">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-krw" aria-hidden="true"></i>
                <div class="icon-title">krw</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="money">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-money" aria-hidden="true"></i>
                <div class="icon-title">money</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rmb">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rmb" aria-hidden="true"></i>
                <div class="icon-title">rmb</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rouble">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rouble" aria-hidden="true"></i>
                <div class="icon-title">rouble</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rub">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rub" aria-hidden="true"></i>
                <div class="icon-title">rub</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ruble">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ruble" aria-hidden="true"></i>
                <div class="icon-title">ruble</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rupee">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rupee" aria-hidden="true"></i>
                <div class="icon-title">rupee</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="shekel">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-shekel" aria-hidden="true"></i>
                <div class="icon-title">shekel</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sheqel">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sheqel" aria-hidden="true"></i>
                <div class="icon-title">sheqel</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="try">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-try" aria-hidden="true"></i>
                <div class="icon-title">try</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="turkish-lira">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-turkish-lira" aria-hidden="true"></i>
                <div class="icon-title">turkish-lira</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="usd">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-usd" aria-hidden="true"></i>
                <div class="icon-title">usd</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="won">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-won" aria-hidden="true"></i>
                <div class="icon-title">won</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="yen">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-yen" aria-hidden="true"></i>
                <div class="icon-title">yen</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Text Editor Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="align-center">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-align-center" aria-hidden="true"></i>
                <div class="icon-title">align-center</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="align-justify">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-align-justify" aria-hidden="true"></i>
                <div class="icon-title">align-justify</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="align-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-align-left" aria-hidden="true"></i>
                <div class="icon-title">align-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="align-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-align-right" aria-hidden="true"></i>
                <div class="icon-title">align-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bold">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bold" aria-hidden="true"></i>
                <div class="icon-title">bold</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chain">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chain" aria-hidden="true"></i>
                <div class="icon-title">chain</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chain-broken">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chain-broken" aria-hidden="true"></i>
                <div class="icon-title">chain-broken</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="clipboard">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-clipboard" aria-hidden="true"></i>
                <div class="icon-title">clipboard</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="columns">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-columns" aria-hidden="true"></i>
                <div class="icon-title">columns</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="copy">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-copy" aria-hidden="true"></i>
                <div class="icon-title">copy</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cut">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cut" aria-hidden="true"></i>
                <div class="icon-title">cut</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dedent">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dedent" aria-hidden="true"></i>
                <div class="icon-title">dedent</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eraser">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eraser" aria-hidden="true"></i>
                <div class="icon-title">eraser</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file" aria-hidden="true"></i>
                <div class="icon-title">file</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-o" aria-hidden="true"></i>
                <div class="icon-title">file-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-text">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-text" aria-hidden="true"></i>
                <div class="icon-title">file-text</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="file-text-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-file-text-o" aria-hidden="true"></i>
                <div class="icon-title">file-text-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="files-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-files-o" aria-hidden="true"></i>
                <div class="icon-title">files-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="floppy-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-floppy-o" aria-hidden="true"></i>
                <div class="icon-title">floppy-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="font">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-font" aria-hidden="true"></i>
                <div class="icon-title">font</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="header">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-header" aria-hidden="true"></i>
                <div class="icon-title">header</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="indent">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-indent" aria-hidden="true"></i>
                <div class="icon-title">indent</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="italic">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-italic" aria-hidden="true"></i>
                <div class="icon-title">italic</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="link">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-link" aria-hidden="true"></i>
                <div class="icon-title">link</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="list">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-list" aria-hidden="true"></i>
                <div class="icon-title">list</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="list-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-list-alt" aria-hidden="true"></i>
                <div class="icon-title">list-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="list-ol">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-list-ol" aria-hidden="true"></i>
                <div class="icon-title">list-ol</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="list-ul">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-list-ul" aria-hidden="true"></i>
                <div class="icon-title">list-ul</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="outdent">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-outdent" aria-hidden="true"></i>
                <div class="icon-title">outdent</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paperclip">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paperclip" aria-hidden="true"></i>
                <div class="icon-title">paperclip</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paragraph">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paragraph" aria-hidden="true"></i>
                <div class="icon-title">paragraph</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paste">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paste" aria-hidden="true"></i>
                <div class="icon-title">paste</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="repeat">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-repeat" aria-hidden="true"></i>
                <div class="icon-title">repeat</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rotate-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rotate-left" aria-hidden="true"></i>
                <div class="icon-title">rotate-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rotate-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rotate-right" aria-hidden="true"></i>
                <div class="icon-title">rotate-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="save">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-save" aria-hidden="true"></i>
                <div class="icon-title">save</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="scissors">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-scissors" aria-hidden="true"></i>
                <div class="icon-title">scissors</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="strikethrough">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-strikethrough" aria-hidden="true"></i>
                <div class="icon-title">strikethrough</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="subscript">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-subscript" aria-hidden="true"></i>
                <div class="icon-title">subscript</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="superscript">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-superscript" aria-hidden="true"></i>
                <div class="icon-title">superscript</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="table">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-table" aria-hidden="true"></i>
                <div class="icon-title">table</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="text-height">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-text-height" aria-hidden="true"></i>
                <div class="icon-title">text-height</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="text-width">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-text-width" aria-hidden="true"></i>
                <div class="icon-title">text-width</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="th">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-th" aria-hidden="true"></i>
                <div class="icon-title">th</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="th-large">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-th-large" aria-hidden="true"></i>
                <div class="icon-title">th-large</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="th-list">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-th-list" aria-hidden="true"></i>
                <div class="icon-title">th-list</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="underline">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-underline" aria-hidden="true"></i>
                <div class="icon-title">underline</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="undo">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-undo" aria-hidden="true"></i>
                <div class="icon-title">undo</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="unlink">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-unlink" aria-hidden="true"></i>
                <div class="icon-title">unlink</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Directional Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-double-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-double-down" aria-hidden="true"></i>
                <div class="icon-title">angle-double-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-double-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-double-left" aria-hidden="true"></i>
                <div class="icon-title">angle-double-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-double-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-double-right" aria-hidden="true"></i>
                <div class="icon-title">angle-double-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-double-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-double-up" aria-hidden="true"></i>
                <div class="icon-title">angle-double-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-down" aria-hidden="true"></i>
                <div class="icon-title">angle-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-left" aria-hidden="true"></i>
                <div class="icon-title">angle-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-right" aria-hidden="true"></i>
                <div class="icon-title">angle-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angle-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angle-up" aria-hidden="true"></i>
                <div class="icon-title">angle-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-down" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-left" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-o-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-o-down" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-o-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-o-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-o-left" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-o-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-o-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-o-right" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-o-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-o-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-o-up" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-o-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-right" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-circle-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-circle-up" aria-hidden="true"></i>
                <div class="icon-title">arrow-circle-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-down" aria-hidden="true"></i>
                <div class="icon-title">arrow-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-left" aria-hidden="true"></i>
                <div class="icon-title">arrow-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-right" aria-hidden="true"></i>
                <div class="icon-title">arrow-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrow-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrow-up" aria-hidden="true"></i>
                <div class="icon-title">arrow-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows" aria-hidden="true"></i>
                <div class="icon-title">arrows</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows-alt" aria-hidden="true"></i>
                <div class="icon-title">arrows-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows-h">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows-h" aria-hidden="true"></i>
                <div class="icon-title">arrows-h</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows-v">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows-v" aria-hidden="true"></i>
                <div class="icon-title">arrows-v</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-down" aria-hidden="true"></i>
                <div class="icon-title">caret-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-left" aria-hidden="true"></i>
                <div class="icon-title">caret-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-right" aria-hidden="true"></i>
                <div class="icon-title">caret-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-down" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-left" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-right" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-square-o-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-square-o-up" aria-hidden="true"></i>
                <div class="icon-title">caret-square-o-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="caret-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-caret-up" aria-hidden="true"></i>
                <div class="icon-title">caret-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-circle-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-circle-down" aria-hidden="true"></i>
                <div class="icon-title">chevron-circle-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-circle-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-circle-left" aria-hidden="true"></i>
                <div class="icon-title">chevron-circle-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-circle-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-circle-right" aria-hidden="true"></i>
                <div class="icon-title">chevron-circle-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-circle-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-circle-up" aria-hidden="true"></i>
                <div class="icon-title">chevron-circle-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-down" aria-hidden="true"></i>
                <div class="icon-title">chevron-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-left" aria-hidden="true"></i>
                <div class="icon-title">chevron-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-right" aria-hidden="true"></i>
                <div class="icon-title">chevron-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="chevron-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-chevron-up" aria-hidden="true"></i>
                <div class="icon-title">chevron-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hand-o-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hand-o-down" aria-hidden="true"></i>
                <div class="icon-title">hand-o-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hand-o-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hand-o-left" aria-hidden="true"></i>
                <div class="icon-title">hand-o-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hand-o-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hand-o-right" aria-hidden="true"></i>
                <div class="icon-title">hand-o-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hand-o-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hand-o-up" aria-hidden="true"></i>
                <div class="icon-title">hand-o-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="long-arrow-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-long-arrow-down" aria-hidden="true"></i>
                <div class="icon-title">long-arrow-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="long-arrow-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-long-arrow-left" aria-hidden="true"></i>
                <div class="icon-title">long-arrow-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="long-arrow-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-long-arrow-right" aria-hidden="true"></i>
                <div class="icon-title">long-arrow-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="long-arrow-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-long-arrow-up" aria-hidden="true"></i>
                <div class="icon-title">long-arrow-up</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-down">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-down" aria-hidden="true"></i>
                <div class="icon-title">toggle-down</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-left">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-left" aria-hidden="true"></i>
                <div class="icon-title">toggle-left</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-right">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-right" aria-hidden="true"></i>
                <div class="icon-title">toggle-right</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="toggle-up">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-toggle-up" aria-hidden="true"></i>
                <div class="icon-title">toggle-up</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Video Player Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="arrows-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-arrows-alt" aria-hidden="true"></i>
                <div class="icon-title">arrows-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="backward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-backward" aria-hidden="true"></i>
                <div class="icon-title">backward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="compress">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-compress" aria-hidden="true"></i>
                <div class="icon-title">compress</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="eject">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-eject" aria-hidden="true"></i>
                <div class="icon-title">eject</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="expand">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-expand" aria-hidden="true"></i>
                <div class="icon-title">expand</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fast-backward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fast-backward" aria-hidden="true"></i>
                <div class="icon-title">fast-backward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="fast-forward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-fast-forward" aria-hidden="true"></i>
                <div class="icon-title">fast-forward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="forward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-forward" aria-hidden="true"></i>
                <div class="icon-title">forward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pause">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pause" aria-hidden="true"></i>
                <div class="icon-title">pause</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="play">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-play" aria-hidden="true"></i>
                <div class="icon-title">play</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="play-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-play-circle" aria-hidden="true"></i>
                <div class="icon-title">play-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="play-circle-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-play-circle-o" aria-hidden="true"></i>
                <div class="icon-title">play-circle-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="step-backward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-step-backward" aria-hidden="true"></i>
                <div class="icon-title">step-backward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="step-forward">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-step-forward" aria-hidden="true"></i>
                <div class="icon-title">step-forward</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="stop">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-stop" aria-hidden="true"></i>
                <div class="icon-title">stop</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="youtube-play">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-youtube-play" aria-hidden="true"></i>
                <div class="icon-title">youtube-play</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Brand Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="adn">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-adn" aria-hidden="true"></i>
                <div class="icon-title">adn</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="android">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-android" aria-hidden="true"></i>
                <div class="icon-title">android</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="angellist">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-angellist" aria-hidden="true"></i>
                <div class="icon-title">angellist</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="apple">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-apple" aria-hidden="true"></i>
                <div class="icon-title">apple</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="behance">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-behance" aria-hidden="true"></i>
                <div class="icon-title">behance</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="behance-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-behance-square" aria-hidden="true"></i>
                <div class="icon-title">behance-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bitbucket">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bitbucket" aria-hidden="true"></i>
                <div class="icon-title">bitbucket</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bitbucket-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bitbucket-square" aria-hidden="true"></i>
                <div class="icon-title">bitbucket-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="bitcoin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-bitcoin" aria-hidden="true"></i>
                <div class="icon-title">bitcoin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="btc">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-btc" aria-hidden="true"></i>
                <div class="icon-title">btc</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="buysellads">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-buysellads" aria-hidden="true"></i>
                <div class="icon-title">buysellads</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-amex">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-amex" aria-hidden="true"></i>
                <div class="icon-title">cc-amex</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-discover">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-discover" aria-hidden="true"></i>
                <div class="icon-title">cc-discover</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-mastercard">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-mastercard" aria-hidden="true"></i>
                <div class="icon-title">cc-mastercard</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-paypal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-paypal" aria-hidden="true"></i>
                <div class="icon-title">cc-paypal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-stripe">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-stripe" aria-hidden="true"></i>
                <div class="icon-title">cc-stripe</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="cc-visa">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-cc-visa" aria-hidden="true"></i>
                <div class="icon-title">cc-visa</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="codepen">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-codepen" aria-hidden="true"></i>
                <div class="icon-title">codepen</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="connectdevelop">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-connectdevelop" aria-hidden="true"></i>
                <div class="icon-title">connectdevelop</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="css3">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-css3" aria-hidden="true"></i>
                <div class="icon-title">css3</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dashcube">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dashcube" aria-hidden="true"></i>
                <div class="icon-title">dashcube</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="delicious">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-delicious" aria-hidden="true"></i>
                <div class="icon-title">delicious</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="deviantart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-deviantart" aria-hidden="true"></i>
                <div class="icon-title">deviantart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="digg">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-digg" aria-hidden="true"></i>
                <div class="icon-title">digg</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dribbble">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dribbble" aria-hidden="true"></i>
                <div class="icon-title">dribbble</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="dropbox">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-dropbox" aria-hidden="true"></i>
                <div class="icon-title">dropbox</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="drupal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-drupal" aria-hidden="true"></i>
                <div class="icon-title">drupal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="empire">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-empire" aria-hidden="true"></i>
                <div class="icon-title">empire</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="facebook">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-facebook" aria-hidden="true"></i>
                <div class="icon-title">facebook</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="facebook-f">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-facebook-f" aria-hidden="true"></i>
                <div class="icon-title">facebook-f</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="facebook-official">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-facebook-official" aria-hidden="true"></i>
                <div class="icon-title">facebook-official</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="facebook-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-facebook-square" aria-hidden="true"></i>
                <div class="icon-title">facebook-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="flickr">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-flickr" aria-hidden="true"></i>
                <div class="icon-title">flickr</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="forumbee">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-forumbee" aria-hidden="true"></i>
                <div class="icon-title">forumbee</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="foursquare">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-foursquare" aria-hidden="true"></i>
                <div class="icon-title">foursquare</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ge">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ge" aria-hidden="true"></i>
                <div class="icon-title">ge</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="git">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-git" aria-hidden="true"></i>
                <div class="icon-title">git</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="git-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-git-square" aria-hidden="true"></i>
                <div class="icon-title">git-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="github">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-github" aria-hidden="true"></i>
                <div class="icon-title">github</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="github-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-github-alt" aria-hidden="true"></i>
                <div class="icon-title">github-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="github-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-github-square" aria-hidden="true"></i>
                <div class="icon-title">github-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gittip">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gittip" aria-hidden="true"></i>
                <div class="icon-title">gittip</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="google">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-google" aria-hidden="true"></i>
                <div class="icon-title">google</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="google-plus">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-google-plus" aria-hidden="true"></i>
                <div class="icon-title">google-plus</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="google-plus-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-google-plus-square" aria-hidden="true"></i>
                <div class="icon-title">google-plus-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="google-wallet">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-google-wallet" aria-hidden="true"></i>
                <div class="icon-title">google-wallet</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="gratipay">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-gratipay" aria-hidden="true"></i>
                <div class="icon-title">gratipay</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hacker-news">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hacker-news" aria-hidden="true"></i>
                <div class="icon-title">hacker-news</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="html5">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-html5" aria-hidden="true"></i>
                <div class="icon-title">html5</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="instagram">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-instagram" aria-hidden="true"></i>
                <div class="icon-title">instagram</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ioxhost">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ioxhost" aria-hidden="true"></i>
                <div class="icon-title">ioxhost</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="joomla">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-joomla" aria-hidden="true"></i>
                <div class="icon-title">joomla</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="jsfiddle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-jsfiddle" aria-hidden="true"></i>
                <div class="icon-title">jsfiddle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="lastfm">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-lastfm" aria-hidden="true"></i>
                <div class="icon-title">lastfm</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="lastfm-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-lastfm-square" aria-hidden="true"></i>
                <div class="icon-title">lastfm-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="leanpub">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-leanpub" aria-hidden="true"></i>
                <div class="icon-title">leanpub</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="linkedin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-linkedin" aria-hidden="true"></i>
                <div class="icon-title">linkedin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="linkedin-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-linkedin-square" aria-hidden="true"></i>
                <div class="icon-title">linkedin-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="linux">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-linux" aria-hidden="true"></i>
                <div class="icon-title">linux</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="maxcdn">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-maxcdn" aria-hidden="true"></i>
                <div class="icon-title">maxcdn</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="meanpath">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-meanpath" aria-hidden="true"></i>
                <div class="icon-title">meanpath</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="medium">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-medium" aria-hidden="true"></i>
                <div class="icon-title">medium</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="openid">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-openid" aria-hidden="true"></i>
                <div class="icon-title">openid</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pagelines">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pagelines" aria-hidden="true"></i>
                <div class="icon-title">pagelines</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="paypal">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-paypal" aria-hidden="true"></i>
                <div class="icon-title">paypal</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pied-piper">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pied-piper" aria-hidden="true"></i>
                <div class="icon-title">pied-piper</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pied-piper-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pied-piper-alt" aria-hidden="true"></i>
                <div class="icon-title">pied-piper-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pinterest">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pinterest" aria-hidden="true"></i>
                <div class="icon-title">pinterest</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pinterest-p">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pinterest-p" aria-hidden="true"></i>
                <div class="icon-title">pinterest-p</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="pinterest-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-pinterest-square" aria-hidden="true"></i>
                <div class="icon-title">pinterest-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="qq">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-qq" aria-hidden="true"></i>
                <div class="icon-title">qq</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ra">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ra" aria-hidden="true"></i>
                <div class="icon-title">ra</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="rebel">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-rebel" aria-hidden="true"></i>
                <div class="icon-title">rebel</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="reddit">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-reddit" aria-hidden="true"></i>
                <div class="icon-title">reddit</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="reddit-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-reddit-square" aria-hidden="true"></i>
                <div class="icon-title">reddit-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="renren">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-renren" aria-hidden="true"></i>
                <div class="icon-title">renren</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="sellsy">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-sellsy" aria-hidden="true"></i>
                <div class="icon-title">sellsy</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share-alt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share-alt" aria-hidden="true"></i>
                <div class="icon-title">share-alt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="share-alt-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-share-alt-square" aria-hidden="true"></i>
                <div class="icon-title">share-alt-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="shirtsinbulk">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-shirtsinbulk" aria-hidden="true"></i>
                <div class="icon-title">shirtsinbulk</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="simplybuilt">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-simplybuilt" aria-hidden="true"></i>
                <div class="icon-title">simplybuilt</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="skyatlas">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-skyatlas" aria-hidden="true"></i>
                <div class="icon-title">skyatlas</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="skype">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-skype" aria-hidden="true"></i>
                <div class="icon-title">skype</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="slack">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-slack" aria-hidden="true"></i>
                <div class="icon-title">slack</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="slideshare">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-slideshare" aria-hidden="true"></i>
                <div class="icon-title">slideshare</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="soundcloud">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-soundcloud" aria-hidden="true"></i>
                <div class="icon-title">soundcloud</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="spotify">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-spotify" aria-hidden="true"></i>
                <div class="icon-title">spotify</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="stack-exchange">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-stack-exchange" aria-hidden="true"></i>
                <div class="icon-title">stack-exchange</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="stack-overflow">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-stack-overflow" aria-hidden="true"></i>
                <div class="icon-title">stack-overflow</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="steam">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-steam" aria-hidden="true"></i>
                <div class="icon-title">steam</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="steam-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-steam-square" aria-hidden="true"></i>
                <div class="icon-title">steam-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="stumbleupon">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-stumbleupon" aria-hidden="true"></i>
                <div class="icon-title">stumbleupon</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="stumbleupon-circle">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-stumbleupon-circle" aria-hidden="true"></i>
                <div class="icon-title">stumbleupon-circle</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tencent-weibo">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tencent-weibo" aria-hidden="true"></i>
                <div class="icon-title">tencent-weibo</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="trello">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-trello" aria-hidden="true"></i>
                <div class="icon-title">trello</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tumblr">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tumblr" aria-hidden="true"></i>
                <div class="icon-title">tumblr</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="tumblr-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-tumblr-square" aria-hidden="true"></i>
                <div class="icon-title">tumblr-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="twitch">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-twitch" aria-hidden="true"></i>
                <div class="icon-title">twitch</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="twitter">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-twitter" aria-hidden="true"></i>
                <div class="icon-title">twitter</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="twitter-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-twitter-square" aria-hidden="true"></i>
                <div class="icon-title">twitter-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="viacoin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-viacoin" aria-hidden="true"></i>
                <div class="icon-title">viacoin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="vimeo-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-vimeo-square" aria-hidden="true"></i>
                <div class="icon-title">vimeo-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="vine">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-vine" aria-hidden="true"></i>
                <div class="icon-title">vine</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="vk">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-vk" aria-hidden="true"></i>
                <div class="icon-title">vk</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wechat">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wechat" aria-hidden="true"></i>
                <div class="icon-title">wechat</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="weibo">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-weibo" aria-hidden="true"></i>
                <div class="icon-title">weibo</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="weixin">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-weixin" aria-hidden="true"></i>
                <div class="icon-title">weixin</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="whatsapp">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-whatsapp" aria-hidden="true"></i>
                <div class="icon-title">whatsapp</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="windows">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-windows" aria-hidden="true"></i>
                <div class="icon-title">windows</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wordpress">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wordpress" aria-hidden="true"></i>
                <div class="icon-title">wordpress</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="xing">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-xing" aria-hidden="true"></i>
                <div class="icon-title">xing</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="xing-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-xing-square" aria-hidden="true"></i>
                <div class="icon-title">xing-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="yahoo">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-yahoo" aria-hidden="true"></i>
                <div class="icon-title">yahoo</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="yelp">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-yelp" aria-hidden="true"></i>
                <div class="icon-title">yelp</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="youtube">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-youtube" aria-hidden="true"></i>
                <div class="icon-title">youtube</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="youtube-play">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-youtube-play" aria-hidden="true"></i>
                <div class="icon-title">youtube-play</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="youtube-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-youtube-square" aria-hidden="true"></i>
                <div class="icon-title">youtube-square</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="panel">
        <div class="panel-heading">
          <h3 class="panel-title">Medical Icons</h3>
        </div>
        <div class="panel-body container-fluid">
          <div class="row">
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="ambulance">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-ambulance" aria-hidden="true"></i>
                <div class="icon-title">ambulance</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="h-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-h-square" aria-hidden="true"></i>
                <div class="icon-title">h-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="heart">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-heart" aria-hidden="true"></i>
                <div class="icon-title">heart</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="heart-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-heart-o" aria-hidden="true"></i>
                <div class="icon-title">heart-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="heartbeat">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-heartbeat" aria-hidden="true"></i>
                <div class="icon-title">heartbeat</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="hospital-o">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-hospital-o" aria-hidden="true"></i>
                <div class="icon-title">hospital-o</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="medkit">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-medkit" aria-hidden="true"></i>
                <div class="icon-title">medkit</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="plus-square">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-plus-square" aria-hidden="true"></i>
                <div class="icon-title">plus-square</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="stethoscope">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-stethoscope" aria-hidden="true"></i>
                <div class="icon-title">stethoscope</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="user-md">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-user-md" aria-hidden="true"></i>
                <div class="icon-title">user-md</div>
              </div>
            </div>
            <div class="col-lg-1 col-md-2 col-sm-3 col-xs-4 icondemo-wrap vertical-align" data-name="wheelchair">
              <div class="icondemo vertical-align-middle">
                <i class="icon fa-wheelchair" aria-hidden="true"></i>
                <div class="icon-title">wheelchair</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>


  <!-- Footer -->
  <footer class="site-footer">
    <span class="site-footer-legal">© 2015 <a href="http://themeforest.net/item/remark-responsive-bootstrap-admin-template/11989202">Remark</a></span>
    <div class="site-footer-right">
      Crafted with <i class="red-600 wb wb-heart"></i> by <a href="http://themeforest.net/user/amazingSurge">amazingSurge</a>
    </div>
  </footer>

  <!-- Core  -->
  <script src="../../assets/vendor/jquery/jquery.js"></script>
  <script src="../../assets/vendor/bootstrap/bootstrap.js"></script>
  <script src="../../assets/vendor/animsition/jquery.animsition.js"></script>
  <script src="../../assets/vendor/asscroll/jquery-asScroll.js"></script>
  <script src="../../assets/vendor/mousewheel/jquery.mousewheel.js"></script>
  <script src="../../assets/vendor/asscrollable/jquery.asScrollable.all.js"></script>
  <script src="../../assets/vendor/ashoverscroll/jquery-asHoverScroll.js"></script>

  <!-- Plugins -->
  <script src="../../assets/vendor/switchery/switchery.min.js"></script>
  <script src="../../assets/vendor/intro-js/intro.js"></script>
  <script src="../../assets/vendor/screenfull/screenfull.js"></script>
  <script src="../../assets/vendor/slidepanel/jquery-slidePanel.js"></script>

  <!-- Plugins For This Page -->
  <script src="../../assets/vendor/asrange/jquery-asRange.min.js"></script>

  <!-- Scripts -->
  <script src="../../assets/js/core.js"></script>
  <script src="../../assets/js/site.js"></script>

  <script src="../../assets/js/sections/menu.js"></script>
  <script src="../../assets/js/sections/menubar.js"></script>
  <script src="../../assets/js/sections/gridmenu.js"></script>
  <script src="../../assets/js/sections/sidebar.js"></script>

  <script src="../../assets/js/configs/config-colors.js"></script>
  <script src="../../assets/js/configs/config-tour.js"></script>

  <script src="../../assets/js/components/asscrollable.js"></script>
  <script src="../../assets/js/components/animsition.js"></script>
  <script src="../../assets/js/components/slidepanel.js"></script>
  <script src="../../assets/js/components/switchery.js"></script>

  <!-- Scripts For This Page -->


  <script src="../../assets/examples/js/uikit/icon.js"></script>


</body>

</html>